<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Staff Info Management</title>
</head>
<body>
    <h1>上链查询系统</h1>

    <h2>上链</h2>
    <form id="setForm">
        <label for="setNo"> No:</label>
        <input type="text" id="setNo" name="no" required>
        <label for="setName">Staff Name:</label>
        <input type="text" id="setName" name="name" required>
        <button type="submit">Set Info</button>
    </form>
    <div id="setResponse"></div>

    <h2>获取员工信息</h2>
    <form id="getForm">
        <label for="getNo">Staff No:</label>
        <input type="text" id="getNo" name="no" required>
        <button type="submit">Get Info</button>
    </form>
    <div id="getResponse"></div>

    <script>
        document.getElementById('setForm').addEventListener('submit', async function(event) {
            event.preventDefault();

            const no = document.getElementById('setNo').value;
            const name = document.getElementById('setName').value;

            const response = await fetch('http://127.0.0.1:8080/set', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/x-www-form-urlencoded',
                },
                body: new URLSearchParams({ no, name })
            });

            if (response.ok) {
                const result = await response.json();
                document.getElementById('setResponse').innerText = JSON.stringify(result, null, 2);
            } else {
                document.getElementById('setResponse').innerText = `Error: ${response.statusText}`;
            }
        });

        document.getElementById('getForm').addEventListener('submit', async function(event) {
            event.preventDefault();

            const no = document.getElementById('getNo').value;

            const response = await fetch('http://127.0.0.1:8080/get', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/x-www-form-urlencoded',
                },
                body: new URLSearchParams({ no })
            });

            if (response.ok) {
                const result = await response.json();
                document.getElementById('getResponse').innerText = JSON.stringify(result, null, 2);
            } else {
                document.getElementById('getResponse').innerText = `Error: ${response.statusText}`;
            }
        });
    </script>
</body>
</html>
